<template>
  <div class="home">
     <ul>
       <!-- <li v-for="(item,index) in filLi" :key="index">{{item.name}}--{{item.age}}</li> -->
     </ul>
     {{num}}
     {{number}}
     <p>{{count}}</p>
     <p>{{cartNum}}</p>
     <ul>
       <!-- <li v-for="(item,index) in listFilt" :key="index">{{item.price}}</li> -->
     </ul>
     <button @click="add">+++</button>
     <button @click="cartadd">+++</button>
  </div>
</template>

<script>
import { mapActions,mapState } from 'vuex'
export default {
  name: 'Home',
  components: {
  },
  data(){
    return{
      num: 2
    }
  },
  computed:{
    ...mapState({
      cartNum: state => state.a.cartNum,
      count: state => state.count
    }),
    // ...mapGetters(['filLi','a/listFilt']),
    number(){
      return this.num*10;
    }
  },
  methods: {
    ...mapActions(['increment','a/increment']),
    add(){
      this.increment();
      // this.$store.dispatch('increment')
      // this.$store.commit('increment')
    },
    cartadd(){
      this.increment();
    }
  },
}
</script>
